<template>
	<view class="technician-commission-detail pt-md" :style="{background:pageColor}" v-if="detail.id">
		<view class="pd-lg fill-base">
			<view class="flex-y-center f-mini-title c-title">
				<view class="dot mr-sm radius" :style="{background:primaryColor}"></view>订单号<view class="ml-sm">
					{{detail.order_code}}
				</view>
			</view>
			<view class="f-mini-title c-title text-bold mt-lg">项目明细</view>
			<view class="flex-between f-paragraph" :class="[{'mt-lg':index==0},{'mt-md':index!=0}]"
				v-for="(item,index) in detail.order_goods" :key="index">
				<span class="c-paragraph max-470">{{item.goods_name}}<span class="ml-md">x{{item.num}}</span><span
						class="ml-md c-warning" v-if="item.refund_num*1>0">已退x{{item.refund_num}}</span></span>
				<view class="c-title">¥{{item.true_total_price}}<span class="ml-sm c-caption text-delete"
						v-if="item.true_int_price*1 != item.true_total_price*1">¥{{item.true_int_price}}</span></view>
			</view>
			<view class="flex-between f-paragraph mt-lg">
				<view class="c-paragraph">服务时间</view>
				<view class="c-caption">{{detail.time_text}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg">
				<view class="c-paragraph">项目总金额</view>
				<view class="c-title">¥{{detail.init_service_price}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg"
				v-if="(detail.material_price*1 || detail.init_material_price*1)">
				<view class="c-paragraph">{{ $t('action.materialText') }}</view>
				<view class="c-title flex-y-center">¥{{detail.material_price}}
					<view class="ml-sm c-caption text-delete"
						v-if="detail.init_material_price*1>detail.material_price*1">
						¥{{detail.init_material_price}}</view>
				</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.coupon_bear_type == 1 && detail.discount*1>0">
				<view class="c-paragraph">卡券优惠</view>
				<view class="c-title">-¥{{detail.discount}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.member_discount_cash*1>0">
				<view class="c-paragraph">会员卡折扣</view>
				<view class="c-title">-¥{{detail.member_discount_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.refund_price*1>0">
				<view class="c-paragraph">退款金额</view>
				<view class="c-title">-¥{{detail.refund_price}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.refund_comm_cash*1>0">
				<view class="c-paragraph">退款手续费</view>
				<view class="c-title">-¥{{detail.refund_comm_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.refund_empty_cash*1>0">
				<view class="c-paragraph">空单费</view>
				<view class="c-title">-¥{{detail.refund_empty_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg mb-lg">
				<view class="c-paragraph">分成比例</view>
				<view class="c-title">{{detail.coach_balance}}%</view>
			</view>
			<view class="flex-between pt-lg b-1px-t">
				<view @tap.stop="toShowRule" class="f-paragraph c-paragraph flex-y-center">
					应得收益<i class="iconfont iconwentifankui3 ml-sm" v-if="detail.coach_text"></i>
				</view>
				<span class="max-500" style="word-break: break-all">
					{{detail.coach_text ? `${detail.coach_text} =` : ``}}
					<span class="f-caption ml-sm" :style="{color:primaryColor}">¥<span
							class="f-mini-title">{{detail.coach_cash}}</span>
					</span>
				</span>
			</view>
		</view>

		<view class="mt-md pd-lg fill-base" v-if="detail.add_order && detail.add_order.length > 0">
			<view class="f-mini-title c-title text-bold">加时明细</view>
			<block v-for="(item,index) in detail.add_order" :key="index">
				<view class="flex-between f-paragraph"
					:class="[{'mt-lg':aindex==0},{'mt-md':aindex!=0},{'pt-md':index!=0 && aindex==0}]"
					v-for="(aitem,aindex) in item.order_goods" :key="aindex">
					<span class="c-paragraph max-470">{{aitem.goods_name}}{{aindex==0?` (第${index*1+1}次加时)`:''}}<span
							class="ml-md">x{{aitem.num}}</span><span class="ml-md c-warning"
							v-if="aitem.refund_num*1>0">已退x{{aitem.refund_num}}</span></span>
					<!-- <view class="c-title">¥{{aitem.price}}</view> -->
					<view class="c-title">¥{{aitem.true_total_price}}<span class="ml-sm c-caption text-delete"
							v-if="aitem.true_int_price*1 != aitem.true_total_price*1">¥{{aitem.true_int_price}}</span>
					</view>
				</view>
				<view class="flex-between f-paragraph mt-lg mb-lg">
					<view class="c-paragraph">项目总金额</view>
					<view class="c-title">¥{{item.init_service_price}}</view>
				</view>
				<view class="flex-between f-paragraph mt-lg mb-lg"
					v-if="item.init_material_price*1 || item.material_price*1">
					<view class="c-paragraph">{{ $t('action.materialText') }}</view>
					<view class="c-title flex-y-center">
						¥{{detail.material_type==1?item.material_price:item.init_material_price}}
						<view class="ml-sm c-caption text-delete"
							v-if="item.init_material_price*1>item.material_price*1&&detail.material_type==1">
							¥{{item.init_material_price}}</view>
					</view>
				</view>
				<view class="flex-between f-paragraph mt-lg mb-lg" v-if="item.member_discount_cash*1>0">
					<view class="c-paragraph">会员卡折扣</view>
					<view class="c-title">-¥{{item.member_discount_cash}}</view>
				</view>
				<view class="flex-between f-paragraph mt-lg mb-lg" v-if="item.refund_price*1>0">
					<view class="c-paragraph">退款金额</view>
					<view class="c-title">-¥{{item.refund_price}}</view>
				</view>
				<view class="flex-between f-paragraph mt-lg" v-if="item.refund_comm_cash*1>0">
					<view class="c-paragraph">退款手续费</view>
					<view class="c-title">-¥{{item.refund_comm_cash}}</view>
				</view>
				<view class="flex-between f-paragraph mt-lg mb-lg">
					<view class="c-paragraph">分成比例</view>
					<view class="c-title">{{item.coach_balance}}%</view>
				</view>
				<view class="flex-between f-paragraph mt-lg mb-lg" v-if="item.total_share_cash*1>0">
					<view class="c-paragraph">分摊扣费</view>
					<view class="c-title">-¥{{item.total_share_cash}}</view>
				</view>
				<view class="flex-between f-paragraph mt-lg mb-lg">
					<view @tap.stop="toShowAddRule(item.add_coach_rule)" class="f-paragraph c-paragraph flex-y-center">
						应得收益<i class="iconfont iconwentifankui3 ml-sm" v-if="item.add_coach_text"></i>
					</view>
					<span class="max-500" style="word-break: break-all">
						{{item.add_coach_text ? `${item.add_coach_text} =` : ``}}
						<span class="f-caption ml-sm" :style="{color:primaryColor}">¥<span
								class="f-mini-title">{{item.coach_cash}}</span>
						</span>
					</span>
				</view>
			</block>
			<view class="flex-between pt-lg b-1px-t">
				<view class="f-paragraph c-paragraph flex-y-center">加时收益</view>
				<span class="max-500" style="word-break: break-all">
					{{detail.add_order.length>1?`${detail.add_coach_text} =`:``}}
					<span class="f-caption" :class="[{'ml-sm':detail.add_order.length>1}]"
						:style="{color:primaryColor}">¥<span class="f-mini-title">{{detail.add_coach_cash}}</span>
					</span>
				</span>
			</view>
		</view>

		<view class="mt-md pd-lg fill-base" v-if="detail.total_share_cash*1>0">
			<view class="f-mini-title c-title text-bold">扣费明细</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.partner_share_cash*1>0">
				<view class="c-paragraph">{{$t('action.brokerName')}}扣款</view>
				<view class="c-title">-¥{{detail.partner_share_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.channel_share_cash*1>0">
				<view class="c-paragraph">渠道扣款</view>
				<view class="c-title">-¥{{detail.channel_share_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.salesman_share_cash*1>0">
				<view class="c-paragraph">业务扣款</view>
				<view class="c-title">-¥{{detail.salesman_share_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.reseller_share_cash*1>0">
				<view class="c-paragraph">一级{{$t('action.resellerName')}}扣款</view>
				<view class="c-title">-¥{{detail.reseller_share_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.level_reseller_share_cash*1>0">
				<view class="c-paragraph">二级{{$t('action.resellerName')}}扣款</view>
				<view class="c-title">-¥{{detail.level_reseller_share_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.pay_model === 2 && detail.coach_balance_cash*1>0">
				<view class="c-paragraph">储值扣款</view>
				<view class="c-title">-¥{{detail.coach_balance_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.coupon_share_cash*1>0">
				<view class="c-paragraph">卡券扣款</view>
				<view class="c-title">-¥{{detail.coupon_share_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.balance_discount_share_cash*1>0">
				<view class="c-paragraph">储值折扣卡扣款</view>
				<view class="c-title">-¥{{detail.balance_discount_share_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.poster_cash*1>0">
				<view class="c-paragraph">广告费</view>
				<view class="c-title">-¥{{detail.poster_cash}}</view>
			</view>
			<view class="flex-between f-paragraph mt-lg" v-if="detail.point_cash*1>0">
				<view class="c-paragraph">手续费</view>
				<view class="c-title">-¥{{detail.point_cash}}</view>
			</view>
			<view class="flex-between mt-lg pt-lg b-1px-t">
				<view class="f-paragraph c-paragraph">合计扣费</view>
				<view class="flex-y-baseline f-caption c-warning">¥<view class="f-mini-title">
						{{detail.total_share_cash}}
					</view>
				</view>
			</view>
		</view>


		<view class="mt-md pd-lg fill-base" v-if="!detail.car_admin">
			<view class="f-mini-title c-title text-bold">车费明细</view>
			<view class="flex-between f-paragraph mt-lg">
				<view class="c-paragraph">车费收益</view>
				<view class="flex-y-baseline f-caption" :style="{color:primaryColor}">¥<view class="f-mini-title">
						{{detail.true_car_price}}
					</view>
				</view>
			</view>
		</view>

		<view class="space-max-footer"></view>

		<fixed position="bottom">
			<view class="pd-lg fill-base flex-between f-paragraph" style="width:100%">
				<view class="f-mini-title c-title text-bold">实际收益</view>
				<span class="max-500 c-warning" style="word-break: break-all">
					{{`${detail.total_order_text} =`}}
					<span class="f-caption text-bold ml-sm">¥<span
							class="f-mini-title">{{detail.total_order_cash}}</span>
					</span>
				</span>
			</view>
			<view class="space-safe fill-base"></view>
		</fixed>


		<uni-popup ref="show_rule_item" type="center" :maskClick="false" :zIndex="999">
			<view class="common-popup-content fill-base pd-lg radius-34">
				<view class="title">应得收益</view>
				<view class="f-desc c-title mt-lg">
					{{detail.coach_rule}}
				</view>
				<view class="button">
					<view @tap.stop="$refs.show_rule_item.close()" class="item-child c-base"
						:style="{background: primaryColor,color:'#fff'}">知道了</view>
				</view>
			</view>
		</uni-popup>

		<uni-popup ref="show_add_rule_item" type="center" :maskClick="false" :zIndex="999">
			<view class="common-popup-content fill-base pd-lg radius-34">
				<view class="title">加时应得收益</view>
				<view class="f-desc c-title mt-lg">
					{{add_coach_rule}}
				</view>
				<view class="button">
					<view @tap.stop="$refs.show_add_rule_item.close()" class="item-child c-base"
						:style="{background: primaryColor,color:'#fff'}">知道了</view>
				</view>
			</view>
		</uni-popup>

	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapMutations
	} from "vuex"
	export default {
		components: {},
		data() {
			return {
				isLoad: false,
				options: {},
				detail: {},
				add_coach_rule: ''
			}
		},
		computed: mapState({
			configInfo: state => state.config.configInfo
		}),
		async onLoad(options) {
			this.options = options
			await this.initIndex()
		},
		methods: {
			...mapActions(['getConfigInfo']),
			async initIndex(refresh = false) {
				await this.getDetail()
				this.$util.setNavigationBarColor({
					bg: this.primaryColor
				})
				this.isLoad = true
				// #ifdef H5
				if (!refresh) {
					this.$jweixin.hideOptionMenu()
				}
				// #endif
			},
			initRefresh() {
				this.initIndex(true)
			},
			async getDetail() {
				let {
					id
				} = this.options
				let data = await this.$api.technician.coachCommissionInfo({
					id
				})
				let {
					coach_cash,
					true_car_price,
					total_share_cash,
					init_material_price,
					refund_price,
					coach_balance,
					material_price,
					material_type = 0,
					coupon_bear_type = 0,
					discount,
					car_admin = 0,
					refund_comm_cash = 0,
					refund_empty_cash = 0,
					pay_model
				} = data
				let init_service_refund_price = 0
				let member_discount_cash = 0
				let balance_discount_cash = 0
				let init_service_price = 0
				data.order_goods.map(item => {
					item.true_int_price = item.price * item.num
					item.true_total_price = (pay_model == 4 || coupon_bear_type == 2) ? item.price * item.num :
						item.true_price * item.num
					init_service_price += item.true_total_price
					if (item.refund_num * 1 > 0) {
						init_service_refund_price += (item.price * item.num)
					}
					member_discount_cash += item.member_discount_cash * 1
					balance_discount_cash += item.balance_discount_cash * 1
				})
				member_discount_cash = member_discount_cash.toFixed(2) * 1
				balance_discount_cash = balance_discount_cash.toFixed(2) * 1
				init_service_price = init_service_price.toFixed(2) * 1

				let coach_text = ``
				let coach_rule = ``
				if (coupon_bear_type == 1 && ((pay_model == 4 && !refund_price) || pay_model != 4)) {
					coach_text += `(${init_service_price}`
					coach_rule += `应得收益 = (项目总金额`
					if (init_material_price * 1 > 0 && material_type == 1) {
						coach_text += `+${init_material_price}`
						coach_rule += ` + 原${this.$t('action.materialText')}`
					}
					if (member_discount_cash * 1 > 0) {
						coach_text += `-${member_discount_cash}`
						coach_rule += ` - 会员卡折扣`
					}
					if (refund_price * 1 > 0) {
						coach_text += `-${refund_price}`
						coach_rule += ` - 退款金额`
					}
					if (refund_comm_cash * 1 > 0) {
						coach_text += `-${refund_comm_cash}`
						coach_rule += ` - 退款手续费`
					}
					if (refund_empty_cash * 1 > 0) {
						coach_text += `-${refund_empty_cash}`
						coach_rule += ` - 空单费`
					}
					coach_text += `)*${coach_balance}%`
					coach_rule += `) * 分成比例`
					if (material_type == 1 && data.material_price * 1 > 0) {
						coach_text += `-${data.material_price}`
						coach_rule += ` - 实付${this.$t('action.materialText')}`
					}
				}
				data.coach_text = coach_text
				data.coach_rule = coach_rule


				let add_coach_cash = 0
				let add_coach_text = ``
				data.add_order.map((item, index) => {
					item.balance_discount_cash = 0
					item.member_discount_cash = 0
					item.init_service_price = 0
					item.order_goods.map(aitem => {
						aitem.true_int_price = aitem.price * aitem.num
						aitem.true_total_price = (item.pay_model == 4 || item.coupon_bear_type == 2) ?
							aitem.price * aitem.num : aitem.true_price * aitem.num
						item.init_service_price += aitem.true_total_price

						item.member_discount_cash += aitem.member_discount_cash * 1
						item.balance_discount_cash += aitem.balance_discount_cash * 1
					})

					item.member_discount_cash = item.member_discount_cash * 1 > 0 ? item.member_discount_cash
						.toFixed(2) * 1 : ''
					item.balance_discount_cash = item.balance_discount_cash * 1 > 0 ? item
						.balance_discount_cash.toFixed(2) * 1 : ''
					item.init_service_price = item.init_service_price.toFixed(2) * 1

					add_coach_cash += item.coach_cash * 1
					add_coach_text += `${index==0?'':'+'}${item.coach_cash}`

					item.add_coach_text = ``
					item.add_coach_rule = ``
					if (item.coupon_bear_type == 1 && ((item.pay_model == 4 && !item.refund_price) || item
							.pay_model != 4)) {
						item.add_coach_text = `(${item.init_service_price}`
						item.add_coach_rule = `加时应得收益 = (项目总金额`
						if (item.init_material_price * 1 > 0 && item.material_type == 1) {
							item.add_coach_text += `+${item.init_material_price}`
							item.add_coach_rule += ` + 原${this.$t('action.materialText')}`
						}
						if (item.member_discount_cash * 1 > 0) {
							item.add_coach_text += `-${item.member_discount_cash}`
							item.add_coach_rule += ` - 会员卡折扣`
						}
						if (item.refund_price * 1 > 0) {
							item.add_coach_text += `-${item.refund_price}`
							item.add_coach_rule += ` - 退款金额`
						}
						if (item.refund_comm_cash * 1 > 0) {
							item.add_coach_text += `-${item.refund_comm_cash}`
							item.add_coach_rule += ` - 退款手续费`
						}
						item.add_coach_text += `)*${item.coach_balance}%`
						item.add_coach_rule += `) * 分成比例`
						if (item.material_type === 1 && item.init_material_price * 1 > 0) {
							item.add_coach_text += `-${item.material_price}`
							item.add_coach_rule += ` - 实付${this.$t('action.materialText')}`
						}
						if (item.total_share_cash * 1 > 0) {
							item.add_coach_text += `-${item.total_share_cash}`
							item.add_coach_rule += ` - 分摊扣费`
						}
					}
				})

				add_coach_cash = add_coach_cash.toFixed(2)
				data.add_coach_cash = add_coach_cash
				data.add_coach_text = add_coach_text

				data.init_service_price = init_service_price
				data.member_discount_cash = member_discount_cash
				data.balance_discount_cash = balance_discount_cash

				let total_order_text = `${coach_cash}`
				if (data.add_order && data.add_order.length > 0) {
					total_order_text += `+${add_coach_cash}`
				}
				if (total_share_cash * 1 > 0) {
					total_order_text += `-${total_share_cash}`
				}
				if (!car_admin) {
					total_order_text += `+${true_car_price}`
				}
				data.total_order_text = total_order_text

				let total_order_cash = coach_cash * 1 + add_coach_cash * 1 + true_car_price * 1 - total_share_cash * 1
				data.total_order_cash = total_order_cash.toFixed(2)
				this.detail = data
			},
			toShowRule() {
				let {
					coupon_bear_type,
					coach_rule = ''
				} = this.detail
				if (coupon_bear_type === 2 || !coach_rule) return
				this.$refs.show_rule_item.open()
			},
			toShowAddRule(text) {
				if (!text) return
				this.add_coach_rule = text
				this.$refs.show_add_rule_item.open()
			}
		}
	}
</script>


<style lang="scss">
	.technician-commission-detail {
		.dot {
			width: 14rpx;
			height: 14rpx;
		}
	}
</style>